/**
 * 波浪水球
 */

class WaterPolo extends HTMLElement {
	static observedAttributes = ["height", "width", "value"]; // 静态检测属性值

	async connectedCallback() {
		await createScriptElement({
			src: "components/templates/waterPolo/index.css",
			name: "波浪水球css",
			type: "link"
		});
		this.innerHTML = `<canvas id="waterPolo"></canvas>`;
		await createScriptElement({
			src: "components/templates/waterPolo/index.js",
			name: "波浪水球依赖文件",
			type: "script"
		});
	}
	// 属性
	attributeChangedCallback(name, oldValue, newValue) {
		switch (name) {
			case "width":
				updataWidth(newValue);
				break;
			case "height":
				updataHeight(newValue);
				break;
			case "value":
				updataWaterPolo(newValue);
				break;
		}
	}
}

customElements.define("water-polo", WaterPolo);